<template>
  <el-drawer v-model="addDrawer" size="45%" :show-close="false" @opened="openDrawer" @close="closeDrawer">
    <template #title>
      <h2><svg-icon icon-class="list"></svg-icon><span style="padding-left: 15px">{{typeName}}</span></h2>
      <el-button type="primary" @click="confirmClick" :disabled="drawerLoading" v-if="isShowSave">保存</el-button>
    </template>
    <template #default>
      <el-form :model="form" ref="addRef" :inline="true" :rules="formRules" label-width="140px" v-loading="drawerLoading">
        <el-row justify="space-between">
          <el-form-item label="省">
            <el-input v-model="form.province" clearable disabled></el-input>
          </el-form-item>
          <el-form-item label="市">
            <el-input v-model="form.city" clearable disabled></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="区/县">
            <el-input v-model="form.county" clearable disabled></el-input>
          </el-form-item>
          <el-form-item label="构架点编号" prop="id">
            <el-input v-model="form.id" placeholder="请输入构架点编号" clearable maxlength="17"></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="数据模型编号" prop="modelId">
            <el-input v-model="form.modelId" placeholder="请输入数据模型编号" clearable maxlength="17"></el-input>
          </el-form-item>
          <el-form-item label="层面号" prop="layNo">
            <el-input v-model="form.layNo" placeholder="请输入层面号" clearable maxlength="4"></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="层面深度" prop="depth">
            <el-input v-model="form.depth" placeholder="请输入层面深度" clearable maxlength="8"></el-input>
          </el-form-item>
          <el-form-item label="横波波速" prop="vs">
            <el-input v-model="form.vs" placeholder="请输入横波波速" clearable maxlength="8"></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="纵波波速" prop="vp">
            <el-input v-model="form.vp" placeholder="请输入纵波波速" clearable maxlength="8"></el-input>
          </el-form-item>
          <el-form-item label="密度值" prop="rho">
            <el-input v-model="form.rho" placeholder="请输入密度值" clearable maxlength="8"></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="介质品质因子" prop="qq">
            <el-input v-model="form.qq" placeholder="请输入介质品质因子" clearable maxlength="8"></el-input>
          </el-form-item>
        </el-row>
        <el-row justify="space-between">
          <el-form-item label="备注" prop="commentInfo" style="width:100%">
            <el-input v-model="form.commentInfo" placeholder="请输入备注" :autosize="{ minRows: 3, maxRows: 6 }"
              type="textarea" show-word-limit maxlength="2147483647" clearable></el-input>
          </el-form-item>
        </el-row>
      </el-form>
    </template>
  </el-drawer>
</template>
<script setup>
import useSpatialData from '@/hooks/useSpatialData'
import { eightDouble, fourInt } from '@/utils/validate'
const { route, addDrawer, drawerLoading, form, typeName, openDrawer, closeDrawer, confirmClick, isShowSave } = useSpatialData()

const formRules = {
  id: [{ required: true, message: '请填写构架点编号！', trigger: 'blur' }],
  layNo: [fourInt],
  depth: [eightDouble],
  vs: [eightDouble],
  vp: [eightDouble],
  rho: [eightDouble],
  qq: [eightDouble],
  pgdns: [eightDouble],
  pgdew: [eightDouble],
  pgdud: [eightDouble]
}
</script>
<style scoped></style>